<template>
	<view>
		<view class="seepTop">
			<view class="title">
				{{deviceId | decorate(5)}}
			</view>
			<view class="title1">
				m-河南郑州-13000-{{deviceId | decorate(5)}}
			</view>
			<view class="text">
				报告说明: 上机阶段进行宽带与硬件测评,部署任务后每日网络和硬件服务测评质量评测。
			</view>
		</view>
		<view class="seepTop none" v-if="deviceConfig">
			<u-cell-group :border="false">
				<u-cell>
					<view slot="title" class="ucell_l">地域</view>
					<view slot="value" class="ucell_r">{{deviceInfo.province}} {{deviceInfo.city}}</view>
				</u-cell>
				<u-cell>
					<view slot="title" class="ucell_l">运营商</view>
					<view slot="value" class="ucell_r">{{deviceInfo.isp}}</view>
				</u-cell>
				<u-cell>
					<view slot="title" class="ucell_l">城域网节点/接入网节点</view>
					<view slot="value" class="ucell_r">{{deviceInfo.accessType | decorate('accessType')}}</view>
				</u-cell>
				<u-cell>
					<view slot="title" class="ucell_l">NAT类型</view>
					<view slot="value" class="ucell_r">{{deviceInfo.natType | decorate('natType',deviceConfig)}}</view>
				</u-cell>
				<u-cell>
					<view slot="title" class="ucell_l">网络类型</view>
					<view slot="value" class="ucell_r">
						{{deviceInfo.diallingType | decorate('diallingType',deviceConfig)}}</view>
				</u-cell>
			</u-cell-group>
		</view>
		<view class="title_box" v-if="deviceInfo.result">
			<view class="l">
				<view class="title">
					宽带压测
				</view>
				<view class="text">
					测试结果>>
				</view>
			</view>
			<view class="r">
				{{deviceInfo.result.upBandwidthTestTime}}
			</view>
		</view>
		<view class="seepTop none" v-if="deviceInfo.result">
			<u-cell-group :border="false">
				<u-cell>
					<view slot="title" class="ucell_l">上传宽带</view>
					<view slot="value" class="ucell_r">{{deviceInfo.upBandwidth}}Mbps * {{deviceInfo.lineNumber}} =
						{{deviceInfo.upBandwidth*deviceInfo.lineNumber}}Mbps</view>
				</u-cell>
				<u-cell>
					<view slot="title" class="ucell_l">极限压测平均</view>
					<view slot="value" class="ucell_r">
						{{deviceInfo.result.avgTestBandwidth | decorate('avgTestBandwidth')}}</view>
				</u-cell>
	<!-- 			<u-cell>
					<view slot="title" class="ucell_l">极限压测满意度</view>
					<view slot="value" class="ucell_r">99</view>
				</u-cell> -->
				<u-cell>
					<view slot="title" class="ucell_l">丢包压测平均值</view>
					<view slot="value" class="ucell_r">{{deviceInfo.result.packetLossRate}}</view>
				</u-cell>
<!-- 				<u-cell>
					<view slot="title" class="ucell_l">丢包压测满意度</view>
					<view slot="value" class="ucell_r">99</view>
				</u-cell> -->
				<u-cell>
					<view slot="title" class="ucell_l">TCP重传率</view>
					<view slot="value" class="ucell_r"> {{deviceInfo.result.tcpRetransmissionRatio}}</view>
				</u-cell>
				<!-- <u-cell>
					<view slot="title" class="ucell_l">晚高峰压测平均值</view>
					<view slot="value" class="ucell_r">99</view>
				</u-cell> -->
			</u-cell-group>
		</view>
		<view class="title_box" v-if="deviceInfo.result">
			<view class="l">
				<view class="title">
					硬件压测
				</view>
				<view class="text">
				</view>
			</view>
			<view class="r">
				{{deviceInfo.result.upBandwidthTestTime}}
			</view>
		</view>
		<view class="seepTop none" v-if="deviceInfo.result">
			<u-cell-group :border="false">
				<u-cell>
					<view slot="title" class="ucell_l">CPU线程数</view>
					<view slot="value" class="ucell_r">{{deviceInfo.cpuNum}}</view>
				</u-cell>
				<u-cell>	
					<view slot="title" class="ucell_l">内存大小</view>
					<view slot="value" class="ucell_r">{{deviceInfo.memorySize | decorate('avgTestBandwidth1')}}G</view>
				</u-cell>
				<u-cell>
					<view slot="title" class="ucell_l">CPU主频</view>
					<view slot="value" class="ucell_r">{{deviceInfo.cpuFrequency | decorate('avgTestBandwidth1')}}G</view>
				</u-cell>
				<!-- <u-cell>
					<view slot="title" class="ucell_l">宽带磁盘比</view>
					<view slot="value" class="ucell_r">99</view>
				</u-cell>
				<u-cell>
					<view slot="title" class="ucell_l">单线路平均IOPS</view>
					<view slot="value" class="ucell_r">99</view>
				</u-cell>
				<u-cell>
					<view slot="title" class="ucell_l">数据盘</view>
					<view slot="value" class="ucell_r">99</view>
				</u-cell>
				<u-cell>
					<view slot="title" class="ucell_l">网卡</view>
					<view slot="value" class="ucell_r">99</view>
				</u-cell> -->
			</u-cell-group>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				deviceId: '',
				deviceInfo: {},
				deviceConfig: {}
			}
		},
		async onLoad(option) {
			this.deviceId = option.deviceId;
			await this.getConfig()
			await this.getInfo()
		},
		filters: {
			decorate(str, str1, str2) {
				if (str1 == 'accessType') {
					return str == 'host' ? '主机' : '交换机'
				}
				if (str1 == 'avgTestBandwidth') {
					return (str / 1024 / 1024).toFixed(2)
				}if (str1 == 'avgTestBandwidth1') {
					return (str / 1024 / 1024/ 1024).toFixed(2)
				}
				if (str1 == 'natType' || str1 == 'diallingType') {
					for (var i = 0; i < str2[str1].length; i++) {
						if (str2[str1][i].code == str) {
							return str2[str1][i].name
						}
					}
					return
				}
				return str ? str.slice(0, str1) : ''

			}
		},
		methods: {
			getInfo() {
				this.$fun.ajax.post('pai/getDevice', {
					deviceId: this.deviceId,
				}).then(res => {
					this.deviceInfo = res.data
				})
			},
			getConfig() {
				this.$fun.ajax.post('pai/getSubmit').then(res => {
					this.deviceConfig = res.data
				})
			}
		}
	}
</script>

<style lang="scss">
	page {
		background: #EEEEEE;

		.seepTop {
			margin: 20rpx;
			padding: 40rpx;
			border-radius: 20rpx;
			background: #FFFFFF;

			.title {
				font-size: 30rpx;

			}

			.title1 {
				margin-top: 20rpx;
				font-size: 30rpx;
				color: rgb(153, 153, 153);
			}

			.text {
				margin-top: 20rpx;
				font-size: 26rpx;
				color: rgb(153, 153, 153);
			}
		}
	}

	.title_box {
		margin: 20rpx;
		display: flex;
		justify-content: space-between;

		.l {
			display: flex;
			align-items: center;

			.title {
				font-weight: bold;
			}

			.text {
				margin-left: 20rpx;
				font-size: 26rpx;
				color: rgb(46, 91, 255);
			}
		}

		.r {
			font-size: 24rpx;
		}
	}

	.ucell_l,
	.ucell_r {
		display: flex;
	}

	.ucell_l {
		color: #999999;
		font-size: 26rpx;
	}

	.ucell_r {
		color: #333333;
		font-size: 24rpx;
	}

	.none {
		padding: 0 !important;
	}
</style>